@font-face {
    font-family: 'OCR-B';
    src: url('https://megidochan.de/static/fonts/OCR-B.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Howvetica';
    src: url('https://megidochan.de/static/fonts/howvetica.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Warownia';
    src: url('https://megidochan.de/static/fonts/GenEi.ttf') format('opentype');
    font-weight: normal;
    font-style: normal;
}



  /* Animation */
.trickster {
    animation: trickster-mode 413ms steps(1) infinite;
}

@keyframes trickster-mode {
     0%,
  13% {
    color: #ffd1d1;
  }

  14%,
  27% {
    color: #ffe6d1;
  }

  28%,
  41% {
    color: #fff6d1;
  }

  42%,
  56% {
    color: #d1ffe3;
  }

  57%,
  69% {
    color: #d1f9ff;
  }

  70%,
  83% {
    color: #d1dcff;
  }

  84%,
  100% {
    color: #f0d1ff;
  }
}



/*body work*/
/*body work*/
body { 
  background:  
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    url('https://megidochan.de/static/themes/SCHWARZ/hexagon.png'),
    linear-gradient(to bottom, transparent, black);
  background-position: center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center, center center;
  background-size: 12%, 24%, 36%, 48%, 60%, 72%, 84%, 96%, 108%, 120%, 132%, 144%, 154%, 166%, 178%, 190%, 202%, 214%, 100% 100%;
  background-repeat: no-repeat;
  background-attachment: fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, fixed, scroll;
  background-blend-mode: normal;
  image-rendering: crisp-edges;
  background-color: #3f2c6c;
  margin: 0;
  font-family: 'Warownia', Courier New, sans-serif;
  color: #FFFFFF;
  letter-spacing: 1px;
  line-height: 1.5;
}



body:before {
  content: '';
  position: fixed;
  bottom: 0;
  left: -25px;
  width: 100%;
  height: 100%;
  background-image: url('https://megidochan.de/static/themes/SCHWARZ/kpgodhead.png');
  background-size: contain; 
  background-position: center; 
  background-repeat: no-repeat; 
  background-attachment: fixed; 
    transform: rotate(2deg);

  z-index: -2;
}

body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 49.9%; 
  width: 4px;
  height: 100vh; 
  background-color: #e4d184; 
  pointer-events: none;
  z-index: -3;
}

html::before {
  content: '';
  position: absolute;
  top: 240px;
  left: 50%;
  transform: translateX(-50%);
  width: 1354px;
  height: 680px;
  background-image: url('https://megidochan.de/static/themes/SCHWARZ/kptitle.png');
  background-size: contain;
  background-repeat: no-repeat;
  z-index: -1;
}


/*Extra elements*/

::selection {
    background-color: #e4d184;
    color: #FFFFFF; 
}

hr {
  border: none; 
  height: 30px; 
  padding: 14px;
  background-size: 777px 30px;
  background-image: url('https://megidochan.de/static/themes/SCHWARZ/kphr.png');
  background-repeat: no-repeat;
  background-position: center;
}

h1, h2 {
  font-family: 'OCR-B', Courier, Sans-serif;
  color: #e4d184;
  text-shadow: 
      -1px -1px 0 #000,  
      1px -1px 0 #000,
      -1px 1px 0 #000,
      1px 1px 0 #000;
}

form table tr th {
    background: #000;
    border: 1px dotted #e4d184;
}

a, a:visited {
    color: #e4d184;
    text-shadow: 
      -1px -1px 0 #000,  
      1px -1px 0 #000,
      -1px 1px 0 #000,
      1px 1px 0 #000;
}

header {
  background: 
    url('https://megidochan.de/static/themes/SCHWARZ/kpheader.png') no-repeat center top;
  background-size: 1040px 87px;
  height:87px;
  padding: 100px; 
}

header div.subtitle, h1 {
    color: #FFFFFF;
    text-align: center;
}

th, td {
    text-align: center;
    border: 1px solid #e4d184 !important;
    padding: 3px !important;
}

footer {
  background: 
    url('https://megidochan.de/static/themes/SCHWARZ/kpfooter.png') no-repeat center bottom;
  background-size: 1024px 133px;
  height: 134px; 
  @media (max-width: 1050px) {
    background-size: contain; 
  image-rendering: unset;

  }
}

div.boardlist:not(.bottom) {
   background-color: #3f2c6c !important;
   padding: 2px 2px;
   color: white;
   border: 1px solid #e4d184 !important;
   box-shadow: 5px 5px rgba(0, 0, 0, 0.5) !important;
   }


span.heading {
    color: #e9521b;
    font-family: 'OCR-B', 'Courier', sans-serif; 
    font-size: 13pt;
    font-weight: bold;}


div.ban {
    font-family: 'Courier', sans-serif; 
    color: #FFFFFF;
    margin-bottom: 5px;
    border: 1px solid #e4d184;
    background: #3f2c6c;
    padding: 2px;
    max-width: 960px;
}


div.ban h2 {
	background: transparent;
	color: #e4d184;
        font-family: 'OCR-B', Courier New;
}

.thread.grid-li.grid-size-small:hover, .thread.grid-li.grid-size-large:hover, .thread.grid-li.grid-size-vsmall:hover {
   background-color:#3f2c6c!important;}



/*Thread stuff*/
span.subject:after { 
   content: '\A'; white-space:pre;}


div.post.op {
    font-family: arial, helvetica, sans-serif;
    color: #dedede;
    letter-spacing: 0;
    line-height: 1.1;
    padding-bottom: 7px;
    border: solid #e4d184;
    border-width: 1px 1px 1px 5px;
    background-color: #0d0d0d;
    overflow-x: hidden;
}

div.post.reply {
   font-family: arial, helvetica, sans-serif;
   color: #dedede;
   letter-spacing: 0;
   line-height: 1;
   max-width: 95% !important;
   padding: 8px;
   margin-top: 6px;
   border: solid #e4d184;
   border-width: 1px 1px 1px 5px;
   background-color: #0d0d0d;
   box-shadow: 6px 6px rgba(0, 0, 0, 0.5) !important;
}


div.post:hover {
   border: solid white;
   border-width: 1px 1px 1px 5px;

  }

div.post.reply.highlighted {
   font-family: arial, helvetica, sans-serif;
   color: #dedede;
   letter-spacing: 0;
   line-height: 1;
   max-width: 95% !important;
   padding: 8px;
   margin-top: 6px;
   border: solid white;
   border-width: 1px 1px 1px 5px;
   background:
linear-gradient(
        rgba(0, 0, 0, 1), 
        #e4d184
    );
   box-shadow: 6px 6px rgba(0, 0, 0, 0.5) !important;
}


.intro span.subject {
    color: #e4d184;
    font-family: 'OCR-B', Courier, sans-serif;
    }

.intro span.name {
    color: #e4d184;
    font-family: 'Howvetica', Courier, sans-serif;
    }

div.post.reply div.body a {
    color: #e4d184;
}

span.quote {
    letter-spacing: .7px;
    color: #e4d184;
    font-family: 'Warownia', Courier, Sans-serif;
}


input[type="text"], textarea, select {
	background: #000;
	color: #FFFFFF;
	border: 1px solid;
	border-color:#e4d184;
	padding-left: 5px;
	padding-right: -5px;
	font-family: 'Courier New';;
	font-size: 12pt;
}
input[type="password"] {
	background: #000;
	color: #FFFFFF;
	border: 1px solid;
	border-color:#e4d184;
}

form table tr th {
	background: #3f2c6c;
	color: #e4d184;
	font-weight: 800;
	text-align: left;
	padding: 0;
	border: #e4d184 1px solid;
	border-color:#e4d184;
}
div.banner {
	background: #3f2c6c;
        font-family: 'OCR-B', Courier, Sans-serif;
	color: #FFFFFF;
	text-align: center;
	width: 750px;
	padding: 4px;
	padding-left: 12px;
	padding-right: 12px;
	margin-left: auto;
	margin-right: auto;
}

div.pages {
   width: 98%;
   font-family: 'OCR-B';
   color: #FFFFFF;
   border: 1px solid #e4d184;
   text-align: center !important;
   background-color: #3f2c6c;
   box-shadow: 5px 7px rgba(0, 0, 0, 0.5) !important;}

div.pages.top {
    display: block;
    position: static;
    top: 0;
    right: 0;
    opacity: 0.9;
}

div.pages a {
    color: #FFFFFF;
    text-decoration: none;
}

div.pages a.selected, div.pages a:hover {
    color: #e4d184;
    font-weight: bolder;
}


input[type="submit"], button {
	background: #3f2c6c;
	border: 1px dashed;
	border-color:#e4d184;
	color: #FFFFFF;
}
input[type="submit"]:hover, button:hover {
	background: #3f2c6c;
	border: 1px dashed;
	border-color:#e4d184;
	color: #e4d184;
}



    /* Hidden*/
div.boardlist.bottom {
   visibility: hidden !important;}


 p.unimportant {
 visibility: hidden;
 }



/*Post button, menu*/
.post-btn {
   visibility: hidden !important; 
   padding: 0; 
   width: 0; 
   height: 0; 
   display: inline !important;
}


.post-btn:after {
   content: url('https://megidochan.de/static/light.png');
   visibility: visible;
   display: inline;
   position: relative;
   left: -5px;
   width: 12px;
   height: 13px; 
}

li.post-item, li.post-submenu {
   padding:5px 10px!important;
   color:#FFFFFF;
   background:#000;}
   li.post-item:hover, li.post-submenu:hover {
   color:#607fd6;
   background:#e4d184!important;}

.post-menu li {
  min-width: 5px !important;
  min-height: 5px !important;
  list-style: none;
  float: None !important;
  text-align: left !important;
  border: none !important;
  margin: 0px !important;
  font-family: 'OCR-B', serif;
  line-height: 12px !important;}


	
	
	/*Scrollbar*/
::-webkit-scrollbar {
    width: 18px;
}

::-webkit-scrollbar-track {
    background: #000; 
    border-left: 2px solid #e4d184; 
}

::-webkit-scrollbar-thumb {
    background-color: #000; 
    border: 1px solid #e4d184; 
}

/* hoverhandler (hehe)*/
::-webkit-scrollbar-thumb:hover {
    background-color: #e4d184;
    border-color: #DEDEDE;
}

/* Scrollbar for Firefox */
scrollbar-color: #e4d184 #111; /
scrollbar-width: auto; 

